<template>
    <div>
        <van-notify id="van-notify"></van-notify>
        <van-dialog id="van-dialog"></van-dialog>
        <upload-feedback v-show="activeBar === 0"></upload-feedback>
        <my-feedback
            v-show="activeBar === 1"
            @look="changeFeedback"
        ></my-feedback>
        <van-tabbar :active="activeBar" @change.native="changePlace">
            <van-tabbar-item
                :icon="item.icon"
                v-for="item in tabbars"
                :key="item.name"
                >{{ item.name }}</van-tabbar-item
            >
        </van-tabbar>
        <show-feedback
            :feedback="lookingFeedback.feedback"
            :editable="false"
            :show="lookingFeedback.show"
            :canSave="false"
            @close="lookingFeedback.show = false"
        ></show-feedback>
    </div>
</template>

<script>
import vanTabbar from "@/wxcomponents/weapp/dist/tabbar/index";
import vanTabbarItem from "@/wxcomponents/weapp/dist/tabbar-item/index";
import uploadFeedback from "./feedback/uploadFeedback.vue";
import myFeedback from "./feedback/myFeedback.vue";
import showFeedback from "@/components/showFeedback.vue";
export default {
    components: {
        vanTabbar,
        vanTabbarItem,
        uploadFeedback,
        myFeedback,
        showFeedback,
    },

    data() {
        return {
            lookingFeedback: {
                show: false,
                feedback: null,
                editable: false,
            },
            activeBar: 0,
            tabbars: [
                { name: "提交反馈", icon: "smile-comment-o" },
                { name: "我的反馈", icon: "smile-o" },
            ],
        };
    },
    methods: {
        changeFeedback(data) {
            this.lookingFeedback.feedback = data;
            this.lookingFeedback.show = true;
        },
        changePlace({ detail }) {
            this.activeBar = detail;
            console.log(detail);
        },
    },
};
</script>

<style lang="less" scoped>
.main {
    background-color: hsl(210 23% 98% / 1);
    height: 100%;
}
</style>